<template>
    <div class="hot-commodity">
        <Header style="z-index:1025">
            <header-menu :index="'3-4'"></header-menu>
        </Header>
        <top-search :navlist="NavTitle" :height="15"></top-search>
        <title-list :list="listTitle" :width="130"></title-list>
        <div class="swiper">
            <Carousel autoplay loop>
                <CarouselItem>
                    <div class="carousel">
                        <img src="../../assets/banner.png" alt="">
                    </div>
                </CarouselItem>
                <CarouselItem>
                    <div class="carousel">
                        <img src="../../assets/banner.png" alt="">
                    </div>
                </CarouselItem>
                <CarouselItem>
                    <div class="carousel">
                        <img src="../../assets/banner.png" alt="">
                    </div>
                </CarouselItem>
                <CarouselItem>
                    <div class="carousel">
                        <img src="../../assets/banner.png" alt="">
                    </div>
                </CarouselItem>
                <CarouselItem>
                    <div class="carousel">
                        <img src="../../assets/banner.png" alt="">
                    </div>
                </CarouselItem>
            </Carousel>
        </div>
        <div class="container clearfix">
            <div class="title-top">
                <!--<span>已选条件></span>-->
                <!--<Tag v-for="item in count" :key="item" :name="item" closable @on-close="handleClose2">标签{{ item + 1 }}</Tag>-->
                <p>热点推送：徐州第四人民医院整形专科春节特惠，双眼皮整形<b>288</b>元预约中！<span>更多推送></span></p>
            </div>
            <diary-column ></diary-column>
            <sale-option></sale-option>
            <product-reservation :movieList="List"></product-reservation>
        </div>
        <bottom-icon></bottom-icon>
        <Footer>
            <page-footer></page-footer>
        </Footer>
    </div>
</template>

<script>
    import HeaderMenu from '@/components/Header/'
    import PageFooter from '../../components/Footer/'
    import BottomIcon from '../../components/BottomIcon/'
    import TitleList from '../../components/Usertop/TitleList'
    import TopSearch from '../../components/TopSearch/'
    import DiaryColumn from '../../components/DiaryColumn'
    import ProductReservation from '../../components/ProductReservation/index.vue'
    import SaleOption from "../../components/Commodity/SaleOption"
    export default {
        name: "HotCommodity",
        components: {
            PageFooter,
            BottomIcon,
            HeaderMenu,
            TitleList,
            TopSearch,
            ProductReservation,
            DiaryColumn,
            SaleOption
        },
        data () {
            return {
                NavTitle:{
                    id:1,
                    name:'美淘',
                    mytext:'我的预约',
                    type:2
                },
                listTitle: [
                    {id:1,name:"首页",show:false,path:'/commodity'},
                    {id:2,name:"热门项目",show:false,path:'/hotproject'},
                    {id:3,name:"商城",show:true,path:'/hotcommodity'},
                    {id:4,name:"医院",show:false,path:'/comhospital'},
                    {id:5,name:"美容机构",show:false,path:'/cosmetology'},
                    {id:6,name:"医生",show:false,path:'/beautician'},
                    {id:7,name:"翻译 ",show:false,path:'/translate'},
                    {id:8,name:"律师",show:false,path:'/lawyer'},
                ],
                List: [
                    {
                        evaluate:2.0,
                        price:9999,
                        oldPrice:12323,
                        delist:'【水光针】巨补水保湿嫩肤收缩毛毛孔除皱美白补水',
                        jiGou:'美橙医疗整形美容',
                        num:22,
                        type:1
                    },
                    {
                        evaluate:2.0,
                        price:9999,
                        oldPrice:12323,
                        delist:'【水光针】巨补水保湿嫩肤收缩毛毛孔除皱美白补水',
                        jiGou:'美橙医疗整形美容',
                        num:22,
                        type:1
                    },
                    {
                        evaluate:2.0,
                        price:9999,
                        oldPrice:12323,
                        delist:'【水光针】巨补水保湿嫩肤收缩毛毛孔除皱美白补水',
                        jiGou:'美橙医疗整形美容',
                        num:22,
                        type:1
                    },
                    {
                        evaluate:2.0,
                        price:9999,
                        oldPrice:12323,
                        delist:'【水光针】巨补水保湿嫩肤收缩毛毛孔除皱美白补水',
                        jiGou:'美橙医疗整形美容',
                        num:22,
                        type:1
                    },
                    {
                        evaluate:2.0,
                        price:9999,
                        oldPrice:12323,
                        delist:'【水光针】巨补水保湿嫩肤收缩毛毛孔除皱美白补水',
                        jiGou:'美橙医疗整形美容',
                        num:22,
                        type:1
                    },
                    {
                        evaluate:2.0,
                        price:9999,
                        oldPrice:12323,
                        delist:'【水光针】巨补水保湿嫩肤收缩毛毛孔除皱美白补水',
                        jiGou:'美橙医疗整形美容',
                        num:22,
                        type:1
                    },
                    {
                        evaluate:2.0,
                        price:9999,
                        oldPrice:12323,
                        delist:'【水光针】巨补水保湿嫩肤收缩毛毛孔除皱美白补水',
                        jiGou:'美橙医疗整形美容',
                        num:22,
                        type:1
                    },
                    {
                        evaluate:2.0,
                        price:9999,
                        oldPrice:12323,
                        delist:'【水光针】巨补水保湿嫩肤收缩毛毛孔除皱美白补水',
                        jiGou:'美橙医疗整形美容',
                        num:22,
                        type:1
                    },
                    {
                        evaluate:2.0,
                        price:9999,
                        oldPrice:12323,
                        delist:'【水光针】巨补水保湿嫩肤收缩毛毛孔除皱美白补水',
                        jiGou:'美橙医疗整形美容',
                        num:22,
                        type:1
                    },
                    {
                        evaluate:2.0,
                        price:9999,
                        oldPrice:12323,
                        delist:'【水光针】巨补水保湿嫩肤收缩毛毛孔除皱美白补水',
                        jiGou:'美橙医疗整形美容',
                        num:22,
                        type:1
                    },


                ],
                show:true,
                count: [0, 1, 2],
                group_id:'',
                place_id:''
            }
        },
        created () {
          this.init()
        },
        methods: {
            handleClose2 (event, name) {
                const index = this.count.indexOf(name);
                this.count.splice(index, 1);
            },
            init () {
                let  _this = this
                _this.$post('/api/shop/getGoodsList',
                    {
                        group_id:_this.group_id,
                        place_id: _this.place_id
                    },function (res) {
                       console.log(res)
                        _this.$set(res.data,'length',res.data.count)
                        let list = Array.from(res.data);
                        list.forEach(function (i) {
                            _this.$set(i,'type',1);
                        })
                        _this.List = list

                    },function (err,errmsg,errcode) {
                        _this.$message.error(errmsg);

                    }
                )
            }
        }
    }
</script>

<style  lang="less">
    @import "../../style/style";
    .hot-commodity{
        .title-top{
            padding-top: 10px;
            line-height: 30px;
            height: 30px;
            padding-bottom: 30px;
            margin-bottom: 20px;
            >span{
                font-size: 14px;
                font-weight: normal;
                font-stretch: normal;
                letter-spacing: 0px;
                color: #666666;
                padding-right: 5px;
            }
            .ivu-tag{
                background: white;
            }
            .ivu-tag-text{
                color: @theme-color-dark;

            }
            p{
                font-size: 14px;
                font-weight: normal;
                font-stretch: normal;
                letter-spacing: 0px;
                color: #000000;
                width: 75%;
                float: right;
                padding-left: 25%;
                span{
                    font-size: 14px;
                    font-weight: normal;
                    font-stretch: normal;
                    letter-spacing: 0px;
                    color: #ff5371;
                    float: right;
                }
                b{
                    color: red;
                }
            }
        }
    }
</style>